<template>
  <div>
    <a-table
      rowKey="_id"
      size="small"
      :pagination="{
        total: courseList.length,
        defaultPageSize: 20,
        'show-less-items': true,
        'show-size-changer': true,
        'show-quick-jumper': true,
        'hide-on-single-page': true,
      }"
      :bordered="true"
      :row-selection="{
        selectedRowKeys: selectedCourses,
        onChange: onSelectChange,
      }"
      :columns="columns"
      :data-source="courseList"
    >
      <template #operation="record">
        <a-button type="link" @click="editcourse(record)">编辑</a-button>
        <a-button type="link" @click="deletecourse(record)">删除</a-button>
      </template>
    </a-table>

    <!--编辑对话框-->
    <a-modal v-model="editModal_visible" title="编辑课程" @ok="edit_submit">
      <a-form
        :modal="editCourseForm"
        :label-col="{ span: 5 }"
        :wrapper-col="{ span: 12 }"
      >
        <a-form-model-item label="学校">
          <p>{{ orgName }}</p>
        </a-form-model-item>
        <a-form-model-item label="课程编号">
          <a-input
            placeholder="请修改课程编号"
            v-model="editCourseForm.course_id"
          ></a-input>
        </a-form-model-item>
        <a-form-model-item label="课程名称">
          <a-input
            placeholder="请输入课程名称"
            v-model="editCourseForm.name"
          ></a-input>
        </a-form-model-item>
        <a-form-model-item label="学院">
          <a-select v-model="subOrg_name">
            <a-select-option
              v-for="item in colleges"
              :key="item._id"
              :value="item.subOrgName"
            >
              {{ item.subOrgName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="专业">
          <a-select v-model="editCourseForm.major_name">
            <a-select-option
              v-for="item in major_names"
              :key="item._id"
              :value="item.majorName"
            >
              {{ item.majorName }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="学分">
          <a-select v-model="editCourseForm.credit">
            <a-select-option v-for="number in 5" :key="number">
              {{ number }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="开课学期">
          <a-select v-model="editCourseForm.semester">
            <a-select-option v-for="number in 8" :key="number">
              {{ number }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="周学时">
          <a-select v-model="editCourseForm.weekly_hrs">
            <a-select-option v-for="number in 6" :key="number">
              {{ number }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
         <a-form-model-item label="考试方式">
          <a-select v-model="editCourseForm.evaluation">
            <a-select-option v-for="i in evaluation" :key="i">
              {{ i }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="课程类型">
          <a-select v-model="editCourseForm.course_type">
            <a-select-option v-for="i in course_type" :key="i">
              {{ i }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="开课年级">
          <a-select v-model="editCourseForm.grade">
            <a-select-option v-for="i in years" :key="i">
              {{ i }}
            </a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="总学时">
          <a-input
            placeholder="请修改总学时"
            v-model="editCourseForm.total_study_hours"
          ></a-input>
        </a-form-model-item>
      </a-form>
    </a-modal>
  </div>
</template>

<script>
import axiosInstance from "@/utils/axios";
export default {
  components: {},
  props: { 
    courses: { type: Array },
    colleges: { 
      type: Array,
      default(){
            return []
          }
     },
     orgName:String,
     years: { 
      type: Array,
      default(){
            return []
          }
     },
     },
  data() {
    return {
      evaluation: ["考试", "考察"],
      course_type: ["专业方向课", "学院基础课", "公共基础课"],
      editModal_visible:false,
      edit_record:"",
      editCourseForm:{
        course_id:"",
        name:"",
        subOrg_name:"",
        major_name:"",
        credit:"",
        semester:"",
        weekly_hrs:"",
        evaluation:"",
        total_study_hours:"",
        course_type:"",
        grade:""
      },
      labelCol: { span: 4 },
      wrapperCol: { span: 14 },
      subOrg_name:"",
      major_names:[],
      courseList: [],
      selectedCourses: [],
      columns: [
        {
          title: "课程编号",
          dataIndex: "course_id",
          align: "center",
        },
        {
          title: "课程名称",
          dataIndex: "name",
          align: "center",
        },
        {
          title: "所属学院",
          dataIndex: "subOrg_name",
          align: "center",
        },
        {
          title: "专业",
          dataIndex: "major_name",
          align: "center",
        },
        {
          title: "学分",
          dataIndex: "credit",
          align: "center",
        },
        {
          title: "开课学期",
          dataIndex: "semester",
          align: "center",
        },
        {
          title: "周学时",
          dataIndex: "weekly_hrs",
          align: "center",
        },
        {
          title: "实践/实验(学时)",
          dataIndex: "experiment_or_traning_hrs",
          align: "center",
        },
        {
          title: "考核方式",
          dataIndex: "evaluation",
          align: "center",
        },
        {
          title: "课程类型",
          dataIndex: "course_type",
          align: "center",
        },
        {
          title: "开课年级",
          dataIndex: "grade",
          align: "center",
        },
        {
          title: "编辑",
          align: "center",
          scopedSlots: { customRender: "operation" },
        },
      ],
    };
  },
  watch: {
    courses: {
      immediate: true,
      handler(value) {
        // console.log(value);
        this.courseList = value;
      },
    },
    
    subOrg_name(val,oldVal) {
      this.editCourseForm.subOrg_name=val;
      if(oldVal.length!=0){
        //console.log(typeof(oldVal));
        //console.log("------");
        this.editCourseForm.major_name=""
      }
      this.getmajors(val);
    },
  },
  methods: {
    //删除单个课程
    async deletecourse(record) {
      await this.showDeleteConfirm(record._id);
    },
    showDeleteConfirm(record_id) {
      console.log(record_id);
      var that=this;
      this.$confirm({
            title: "确认删除吗",
            content: "数据删除后不可恢复",
            okText: "确定",
            okType: "danger",
            cancelText: "取消",
            async onOk() {
              const url = "/pc/v1/courses/" + record_id;
              try {
                await axiosInstance.delete(url);
                that.$message.info("删除成功！");
                // that.$parent.();
                that.$emit("updateTree");
                 that.courseList=that.courseList.filter(n=>{
                      return record_id!=n._id
                })
              } catch (err) {
                console.log(err);
                that.$message.error("删除失败，请重试！");
              }
            },
            onCancel() {
              // console.log("Cancel");
            },
          });
    },

    async getmajors(queryString) {
      // 按获取专业
       //console.log(queryString)
      // console.log(this.orgName)
      const url =
        "/pc/v1/organizations/" + this.orgName + "/suborgs/" + queryString;
      try {
        const { data } = await axiosInstance.get(url);
        // console.log(data)
        this.major_names = data.majors;
        // console.log(data.data.majors);
      } catch (err) {
        console.log(err);
      }
    },
    onSelectChange(selectedKeys) {
      this.selectedCourses = selectedKeys;
    },
    // onSearch() {},
     editcourse(record) {
      this.edit_record = record._id;
      this.editModal_visible = true;
      this.subOrg_name = record.subOrg_name;//将现在的学院赋给编辑表单
      this.editCourseForm = record;
    },
    edit_submit() {
      //console.log(this.editCourseForm);
      // console.log(requestData);
      const url = `pc/v1/courses/` + this.edit_record;
      const requestbody=this.editCourseForm
      axiosInstance
        .patch(url,requestbody )
        .then(({ data }) => {
          this.$message.info("修改成功");
          //this.refresh += 1;
        })
        .catch(() => {
          this.$message.error("修改失败，请重试！");
        });
      this.editModal_visible = false;
    },
  },
};
</script>

<style scoped>
.btn-area {
  padding-bottom: 10px;
}

.btn .ant-btn {
  margin: 0 5px;
}
</style>
